<template>
  <div id="app">
    <headpiece v-if="$route.path.search('/agreement/') == -1" :configInfo = "configInfo"></headpiece>
    <router-view />
    <foot  v-if="$route.path.search('/agreement/') == -1&&$route.path.search('/login') == -1&&$route.path.search('/forgetpw') == -1" :configInfo = "configInfo" :flootInfo = "flootInfo"></foot>
  </div>
</template>

<script>

import headpiece from './components/head';
import foot from './components/footer';
import { mapMutations, mapState } from "vuex";
export default {
  name: 'app',
  data() {
    return {
      // background:"blue",
      color:'red',
      configInfo:{},
      flootInfo:[],
    }
  },
  created() { 
    console.log(this.$route.path,this.$route.path.search('/agreement/'),'456789876543567897654app')
    this.getConfig()
    this.getHelp()//底部帮助中心文章分类
    

  },
  components: {
    ...mapState(['token']),
  },
  beforeDestroy(){
    localStorage.setItem("activeMenu",1)
  },
  components: {
    // HelloWorld
    headpiece,
    foot
  },
  methods: {
    ...mapMutations(['set_configInfo','set_flootInfo']),
    
    getHelp(){
      this.$api.getHelp().then(res => {
        if(res.status == 200){
          this.set_flootInfo(res.data)
          localStorage.setItem('flootInfo', res.data);
          this.flootInfo = res.data

        }
      })
    },
    async getConfig(){
      console.log(this.$store.state.company_id,111)
      let res = await this.$api.config.list()
        if(res.status == 200){
          this.configInfo = res.data
          document.getElementsByTagName('body')[0].style.setProperty('--bg-color', res.data.color?res.data.color:'#FF6900');
          document.getElementsByTagName('body')[0].style.setProperty('--color', '#fff');
          localStorage.setItem('configInfo', res.data);
          this.set_configInfo(res.data)
        }else{
          document.getElementsByTagName('body')[0].style.setProperty('--bg-color','#FF6900');
          document.getElementsByTagName('body')[0].style.setProperty('--color', '#fff');
        }
    }
  },
}
</script>

<style lang="scss" >
// 公共样式
$background:var(--bg-color,'#FF6900');
$color:var(--color,'#fff');
#theme{
  background-color:$background;
  color: $color;
}
html, body, div, span,object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strike, strong, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;font: inherit;}
li{list-style-type:none;}
*{padding:0; margin:0;}
body a{cursor: pointer; text-decoration:none; color: #333;}
.w1200{width: 1200px; margin: 0 auto;}
#app {
  // width: 100vw;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  // overflow-y: scroll;
}
.box {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}
.content{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 0 30px;
}
#swiper{
  width: 100%;
  height: 100%;
  #swiperSlide{
    
  }
}
</style>
